class PraiseButton {
  constructor(parent) {
    this._button = document.createElement('div');
    this._praiseCount = 0;
    this._incEventHandle = null;
    this._button.innerHTML = '';
    this._incPraiseThrottle = this._throttle(this.incPraise, 1000, this);
    this._lineHeightRate = 1;

    this._setWidth(100);

    parent.appendChild(this._button);
  }

  init(initCount){
    this._praiseCount = initCount;
    this._button.innerHTML = this._praiseCount;

    this._button.addEventListener('click' , this._incPraiseThrottle);
  }

  //节流，函数式
  _throttle(fn, delay, context) {
    let timer
    let lastCall = 0
    return function (...args) {
      const now = new Date().getTime()
      if (now - lastCall < delay) return
      lastCall = now
      fn.call(context,...args)      
    }
  }

  get praiseCount () {
    return this._praiseCount;
  }


  get buttonWidth () {
    return this._buttonWidth;
  }

  set buttonWidth(value) {
    this._setWidth(value);
  }


  get incEventHandle () {
    return this._incEventHandle;
  }

  set incEventHandle(fn) {
    this._incEventHandle = fn;
  }

  incPraise(){
    this._praiseCount++;
    this._button.innerHTML = this._praiseCount;

    if(this._incEventHandle != null){
      this._incEventHandle();
    }
  }
  _setWidth(width){
    this._buttonWidth = width;
    this._button.style.width = width + 'px';
    this._button.style.height = width + 'px';
    this._button.style.lineHeight = (width*this._lineHeightRate) + 'px';
    this._button.style.textAlign = 'center';
  }
  
}

class Thumb extends PraiseButton{
  constructor(parent) {
    super(parent);
    this._lineHeightRate = 1.3;
  }
}

class Star extends PraiseButton{
  constructor(parent) {
    super(parent);
  }
}
export {PraiseButton,Thumb, Star};